import Vue from "vue";
import VueRouter from "vue-router";
import DetailPage from "@/components/detailPage/DetailPage.vue";
//二层,首页,课程与活动共用Course
import Pins from "@/components/pins/Pins.vue";
import Course from "@/components/Course.vue";
import Live from "@/components/live/Live.vue";
//三层
import CourseType from "@/components/course/CourseType.vue";
import HomeType from "@/components/home/Home.vue";
import Events from "@/components/events/Events.vue";

import HomeSortDetail from "@/components/home/HomeSortDetail.vue";

Vue.use(VueRouter);

const router = new VueRouter({
  //去除/#/
  mode: "history",
  routes: [
    //一级路由
    // 详情页
    { path: "/detailPage", component: DetailPage },
    //沸点
    { path: "/pins", component: Pins },
    //直播
    { path: "/live", component: Live },
    //活动
    {
      path: "/event",
      component: Course,
      props: {
        CourseList: [
          { key: 0, path: "/event/all", detail: "全部活动" },
          { key: 1, path: "/event/beijing", detail: "北京" },
          { key: 2, path: "/event/shanghai", detail: "上海" },
          { key: 4, path: "/event/guangzhou", detail: "广州" },
          { key: 5, path: "/event/shenzhen", detail: "深圳" },
          { key: 6, path: "/event/hangzhou", detail: "杭州" },
          { key: 7, path: "/event/other", detail: "其他" },
        ],
      },
      children: [{ path: "/event/:type", component: Events, props: true }],
    },
    //课程
    {
      //课程二级路由参数
      path: "/course",
      component: Course,
      props: {
        CourseList: [
          { key: 0, path: "/course/", detail: "全部" },
          { key: 1, path: "/course/backend", detail: "后端" },
          { key: 2, path: "/course/frontend", detail: "前端" },
          { key: 4, path: "/course/ios", detail: "IOS" },
          { key: 5, path: "/course/ai", detail: "人工智能" },
          { key: 6, path: "/course/freebie", detail: "开发工具" },
          { key: 7, path: "/course/career", detail: "代码人生" },
          { key: 8, path: "/course/article", detail: "阅读" },
        ],
      },
      children: [
        //首页以及课程的二级路由采用动态路由形式
        //   如 /course/all
        //      /course/frontend
        //      /course/backend 采用/course/:type绑定形式，复用二级路由的CourseType组件并开启传参
        { path: "/course/:title", component: CourseType, props: true },
        { path: "/course/", component: CourseType, props: true },
      ],
    },
    //首页，优先级最低
    {
      path: "",
      component: Course,
      props: {
        //首页二级路由参数
        CourseList: [
          { key: 0, path: "/", detail: "综合" },
          { key: 1, path: "/backend", detail: "后端" },
          { key: 2, path: "/frontend", detail: "前端" },
          { key: 3, path: "/ios", detail: "IOS" },
          { key: 5, path: "/ai", detail: "人工智能" },
          { key: 6, path: "/freebie", detail: "开发工具" },
          { key: 7, path: "/career", detail: "代码人生" },
          { key: 8, path: "/article", detail: "阅读" },
        ],
      },
      children: [
        //首页以及课程的二级路由采用动态路由形式
        {
          path: ":type",
          component: HomeType,
          props: true,
          children: [
            //三级HomesortDetail路由
            { path: "", component: HomeSortDetail, props: true },
          ],
        },
        {
          path: "",
          component: HomeType,
          props: true,
          children: [
            //三级HomesortDetail路由
            { path: "", component: HomeSortDetail, props: true },
          ],
        },

        // { path: '/backend', component: HomeType, props: true },
        // { path: '/frontend', component: HomeType, props: true },
      ],
    },
  ],
});

export default router;
